function pctChange(val) {
	return '<span style="color:blue;cursor:pointer;text-decoration:underline;">' + val + '</span>';
}

//收集数据(name);
var gatherPanelData_name=function(panelId){
	var data={}
		var inputs=Ext.getDom(panelId).getElementsByTagName("input");
		Ext.each(inputs,function(el){
			data[el.name]=Ext.getCmp(el.id).getValue();
		})
	return data;	
}
Ext.override(Ext.Toolbar,{
	 beforeEffect : function(anim){
        if(this.floating){
            this.el.beforeAction();
        }
        if(anim !== false){
            this.el.addClass('x-panel-animated');
        }
    },

    // private
    afterEffect : function(anim){
        this.syncShadow();
        this.el.removeClass('x-panel-animated');
    },

    // private - wraps up an animation param with internal callbacks
    createEffect : function(a, cb, scope){
        var o = {
            scope:scope,
            block:true
        };
        if(a === true){
            o.callback = cb;
            return o;
        }else if(!a.callback){
            o.callback = cb;
        }else { // wrap it up
            o.callback = function(){
                cb.call(scope);
                Ext.callback(a.callback, a.scope);
            };
        }
        return Ext.applyIf(o, a);
    },

 collapse : function(animate){
        if(this.collapsed || this.el.hasFxBlock() || this.fireEvent('beforecollapse', this, animate) === false){
            return;
        }
        var doAnim = animate === true || (animate !== false && this.animCollapse);
        this.beforeEffect(doAnim);
        this.onCollapse(doAnim, animate);
        return this;
    },

    // private
    onCollapse : function(doAnim, animArg){
        if(doAnim){
            this[this.collapseEl].slideOut(this.slideAnchor,
                    Ext.apply(this.createEffect(animArg||true, this.afterCollapse, this),
                        this.collapseDefaults));
        }else{
            this[this.collapseEl].hide(this.hideMode);
            this.afterCollapse(false);
        }
    },

    // private
    afterCollapse : function(anim){
        this.collapsed = true;
        this.el.addClass(this.collapsedCls);
        if(anim !== false){
            this[this.collapseEl].hide(this.hideMode);
        }
        this.afterEffect(anim);

        // Reset lastSize of all sub-components so they KNOW they are in a collapsed container
        this.cascade(function(c) {
            if (c.lastSize) {
                c.lastSize = { width: undefined, height: undefined };
            }
        });
        this.fireEvent('collapse', this);
    },

    /**
     * Expands the panel body so that it becomes visible.  Fires the {@link #beforeexpand} event which will
     * cancel the expand action if it returns false.
     * @param {Boolean} animate True to animate the transition, else false (defaults to the value of the
     * {@link #animCollapse} panel config)
     * @return {Ext.Panel} this
     */
    expand : function(animate){
        if(!this.collapsed || this.el.hasFxBlock() || this.fireEvent('beforeexpand', this, animate) === false){
            return;
        }
        var doAnim = animate === true || (animate !== false && this.animCollapse);
        this.el.removeClass(this.collapsedCls);
        this.beforeEffect(doAnim);
        this.onExpand(doAnim, animate);
        return this;
    },

    // private
    onExpand : function(doAnim, animArg){
        if(doAnim){
            this[this.collapseEl].slideIn(this.slideAnchor,
                    Ext.apply(this.createEffect(animArg||true, this.afterExpand, this),
                        this.expandDefaults));
        }else{
            this[this.collapseEl].show(this.hideMode);
            this.afterExpand(false);
        }
    },

    // private
    afterExpand : function(anim){
        this.collapsed = false;
        if(anim !== false){
            this[this.collapseEl].show(this.hideMode);
        }
        this.afterEffect(anim);
        if (this.deferLayout) {
            delete this.deferLayout;
            this.doLayout(true);
        }
        this.fireEvent('expand', this);
    },
    toggleCollapse : function(animate){
        this[this.collapsed ? 'expand' : 'collapse'](animate);
        return this;
    },
    syncShadow : function(){
        if(this.floating){
            this.el.sync(true);
        }
    }
})
var welcome = new Ext.form.Label({
	id:'welcomePanel',
	width:200,
	text  : "欢迎您 :  "+userName+ "！"
});

var aboutBT=new Ext.Button({
		text:"关于",
		handler:function(){
			 var win = new Ext.Window({
            	title : '关于',
            	resizable:false,
            	border:false,
            	draggable:false,
                layout      : 'fit',
                width       : 400,
                height      : 300,
                closeAction :'hide',
                html:'<span class="about"><BR><p>版本:***系统0.9.0(2009-06-01)</p><BR><p>***版权所有!</p><p>Copyright 2008-2009 YIHAI KERRY.All right reserved!<p><BR></span>',
                plain       : true
            });
			  win.show();
			  return false;
		}
	})
	
	var passwordBT=new Ext.Button({
		text:"修改密码",
//		hidden : userType!='A',
		handler:function(){
			 var win = new Ext.Window({
            	title : '修改密码',
            	resizable:false,
            	modal :true,
            	id:'win_changPassword',
                border:false,
                frame:true,
                bodyStyle:'padding:10px;',
                layout:'form',
                labelWidth:60,
                labelAlign:'right',
                defaults:{
                	xtype:'textfield',
                	allowBlank :false,
                	inputType:'password'
                },
                items:[{
                		cls : 'key',
                		name:'oldPassword',
                		fieldLabel:'原始密码',
                		blankText : '现密码不能为空'
                	},{
                		name:'newPassword',
                		fieldLabel:'新设密码',
                		blankText : '新密码不能为空'
                	},{
                		name:'confirmPassword',
                		fieldLabel:'确认密码',
                		blankText : '确认密码不能为空'
                }],
                buttons:[{
                	text:'确认',
                	handler:function(){
                		var data=gatherPanelData_name('win_changPassword');
                		if (Ext.isEmpty(data.oldPassword)){
							Ext.Msg.alert('提示','原始密码不能为空！');
							return ;
                		} else if (Ext.isEmpty(data.newPassword)) {
                			Ext.Msg.alert('提示','新设密码不能为空！');
                			return ;
                		} else if (Ext.isEmpty(data.confirmPassword)) {
                			Ext.Msg.alert('提示','确认密码不能为空！');
                			return ;
                		}
                		if(data.newPassword!=data.confirmPassword){
                			Ext.Msg.alert('提示', '两次(新)密码输入不一置!');
                			return ;
                		}
                		
                		Ext.Msg.wait("正在通信,请稍后...")
						Ext.Ajax.requestSyn({
								url : "updateBackUserPW.action",
								params : {
									oldPassword:data.oldPassword,
									newPassword :data.newPassword,
									surePassword:data.confirmPassword
								},
								success : function(resp) {
									var msg = Ext.decode(resp);
									Ext.Msg.alert(msg.success?"成功":"异常", msg.msg)
								},
								error : function() {
									Ext.Msg.alert("错误", "系统异常,请联系管理员!")
								}
						})
                		win.destroy();
                	}
                }]
               
            });
			  win.show();
			  return false;
		}
	})
	var logoutBT=new Ext.Button({
		text:'登出',
		handler : function () {
			 Ext.Ajax.requestSyn({
				url: "loginOut.action",
				success: function(rep){
					var msg = Ext.decode(rep);
					if(!msg.success){
						Ext.Msg.alert("提示","该用户名已存在,请重新输入");
						rslt=false;
					}
       	 		}
    		});
    		window.location.href =  basePath + "back/backlogin.jsp"
    		return rslt;
		}
	})
	
	var themeData=[{text:'gray'},
		{text:'green'},
		{text:'default'},
		{text:'calista'},
		{text:'darkgray'},
		{text:'indigo'},
		{text:'midnight'},
		{text:'olive'},
		{text:'pink'},
		{text:'purple'},
		{text:'slate'},
		{text:'darkgray'},
		{text:'access'},
		{text:'galdaka'},
		{text:'vista'}]
		
	var themeStore=new Ext.data.JsonStore({
		data:themeData,
		fields: ['text']
	})
	
    var combo_theme = new Ext.form.ComboBox({
    	anchor:'90%',
    	width:90,
        store: themeStore,
        displayField: 'text',
        valueField: 'text',
        typeAhead: true,
	    triggerAction: 'all',
	    lazyRender:true,
	    mode: 'local',
	    emptyText:'请选择皮肤',
        editable: false,
		mode:"local",
        listeners: {
            select: function(combo, rcd, index){
				var theme = rcd.get('text');
				changerTheme(theme);
				var con=new connection({
					model:false,
					url:'changeTheme.action',
					params:{
						json:theme
					},
					callback:function(opt, suc, rep){
					}
				})
				con.submit();
				
            }
        }
    });
    
Ext.MyViewport = Ext.extend(Ext.Viewport, {
    layout: "border",
    initComponent: function(){
    	
    	var userPower=new Ext.util.MixedCollection();
    	Ext.Ajax.requestSyn({
			url : "queryUserFunction.action",
			params : {
				userId : userId
			},
			success : function(resp) {
				var data = Ext.decode(resp);
				// 加载用户权限树列表
				Ext.each(data.list, function(obj) {
					var item=new Ext.menu.Item({
						icon: obj.functionIcon,
		                url: obj.functionUrl,
		                text: obj.functionName,
		                handler: function(item, e){
		                    addPanel(item)
		                }
					})
					
					userPower.add(obj.functionCode,item);
				})
			},
			error : function() {
				Ext.Msg.alert("错误", "系统异常,请联系管理员!")
			}
		})
        this.items = [{
        	xtype:'toolbar',
        	style :'padding:5px 30px 0 30px;',
			region: "north",
			frame: true,
			split: true,
			collapseMode: 'mini',
			layout:'toolbar',
			items: [welcome,'->',aboutBT,passwordBT,logoutBT,combo_theme],
			height: 30
		}, {
            title: "后台管理",
            region: "west",
			xtype:'panel',
			collapsible:true,
			frame:true,
            split : true,
			margins : '0 0 5 5',
			width : 150,
			layoutConfig : {
						animate : true
					},
            items: userPower.items
        }, {
            region: "center",
            xtype: "tabpanel",
            activeTab: 0,
			deferredRender : false,
			enableTabScroll:true,
            id: 'mainFramePanel',
            items: [{
                xtype: "panel",
                closable : true,
                title: "首页",
                border: false,
                html: '欢迎来到XXXX系统!'
            }]
        }, {
        	split: true,
			collapseMode: 'mini',
            region: "south",
			frame:true,
			html:'版权信息'
        }]
        Ext.MyViewport.superclass.initComponent.call(this);
    }
});
function addPanel(item){
	var mainFramePanel=Ext.getCmp('mainFramePanel');
	
	
	var panel=mainFramePanel.getItem(item.url);
	if(typeof(panel)=='object'){
		mainFramePanel.activate(panel)
	}else{
		var iframe=document.createElement('iframe');
   		iframe.src=item.url;
		var panel=new  Ext.Panel({
			title:item.text,
			closable : true,
			id:item.url,
			html : '<iframe id = "iframe' + item.url + '" name = "iframe' + item.url
					+ '" style = "border:0px solid blue;width:100%;height:100%" src = "' + item.url  + '"/>'
		}) 
		mainFramePanel.add(panel);
		mainFramePanel.activate(panel)
	}
	
}
Ext.onReady(function(){
    new Ext.MyViewport();
})
